<nav class="navbar navbar-toggleable-md navbar-light fixed-top topbar">
  <button type="button" class="navbar-toggler navbar-toggler-left " data-target="#leftNavs"
          aria-label="Toggle navigation">
    <a (click)="handleNavsLeft()"><span>&#9776;</span></a>
  </button>
  <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse"
          data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
          aria-expanded="true" aria-label="Toggle navigation">
    <span (click)="leftNavShow=false">&#9776;</span>
  </button>
  <div class="collapse navbar-collapse topbar" id="navbarSupportedContent">
    <ul class="nav navbar-nav blue-back-color">
      <li class="nav-item">
        <a class="nav-link" routerLink="about" routerLinkActive="active">
          <span>{{ "ABOUT" | translate}}</span>
        </a>
      </li>
      <li class="nav-item">
        <a class="nav-link" routerLink="login" routerLinkActive="active">
          <span>{{ "LOGOUT" | translate }}</span>
        </a>
      </li>
    </ul>
    <form class="form-inline my-2 my-lg-0 blue-back-color">

    </form>
  </div>
</nav>
<div class="sidebar" id="#leftNavs" [ngClass]="{'showLeftNavs': leftNavShow}">
  <app-navs *ngFor="let menu of menus" [menu]="menu" (onClickWord)="onClickWord($event)"></app-navs>
</div>
<div class="container-fluid mainBottom" >
  <router-outlet></router-outlet>
</div>
